import { localCache } from '@/utils/cache'
import { createRouter, createWebHashHistory } from 'vue-router'

import { firstMenu } from '../storage/login/login'

const router = createRouter({
  history: createWebHashHistory(),
  routes: [
    {
      path: '/',
      redirect: '/main',
    },
    {
      path: '/login',
      component: () => import('../views/Login/Login.vue'),
    },
    {
      // 手动配置路由  ************************************************************************************************************
      path: '/main',
      name: 'main', // 标记名称 用于添加新路由
      component: () => import('../views/Main/Main.vue'),

      // 方式 一 手动配置
      // children: [
      //   {
      //     path: '/main/analysis/overview', // 路由地址 自定义
      //     component: () => import('../views/Main/analysis/overview/overview.vue'), // 实际跳转地址 对应views 下的 main【自定义】文件夹下的 xxx 文件夹和文件
      //   },
      //   {
      //     path: '/main/analysis/dashboard',
      //     component: () => import('../views/Main/analysis/dashboard/dashboard.vue'),
      //   },
      //   {
      //     path: '/main/product/goods',
      //     component: () => import('../views/Main/product/goods/goods.vue'),
      //   },
      //   {
      //     path: '/main/product/category',
      //     component: () => import('../views/Main/product/category/category.vue'),
      //   },
      //   {
      //     path: '/main/system/user',
      //     component: () => import('../views/Main/system/user/user.vue'),
      //   },
      //   {
      //     path: '/main/system/role',
      //     component: () => import('../views/Main/system/role/role.vue'),
      //   },
      //   {
      //     path: '/main/system/menu',
      //     component: () => import('../views/Main/system/menu/menu.vue'),
      //   },
      //   {
      //     path: '/main/system/detpartment',
      //     component: () => import('../views/Main/system/department/department.vue'),
      //   },
      // ],
    },
    {
      path: '/:pathMatch(.*)',
      component: () => import('../views/NotFound/NotFound.vue'),
    },
  ],
})

// 方式二 手动单独配置
// const localRouters = [
//   {
//     path: '/main/analysis/overview', // 路由地址 自定义
//     component: () => import('../views/Main/analysis/overview/overview.vue'), // 实际跳转地址 对应views 下的 main【自定义】文件夹下的 xxx 文件夹和文件
//   },
//   {
//     path: '/main/analysis/dashboard',
//     component: () => import('../views/Main/analysis/dashboard/dashboard.vue'),
//   },
//   {
//     path: '/main/product/goods',
//     component: () => import('../views/Main/product/goods/goods.vue'),
//   },
//   {
//     path: '/main/product/category',
//     component: () => import('../views/Main/product/category/category.vue'),
//   },
//   {
//     path: '/main/system/user',
//     component: () => import('../views/Main/system/user/user.vue'),
//   },
//   {
//     path: '/main/system/role',
//     component: () => import('../views/Main/system/role/role.vue'),
//   },
//   {
//     path: '/main/system/menu',
//     component: () => import('../views/Main/system/menu/menu.vue'),
//   },
//   {
//     path: '/main/system/detpartment',
//     component: () => import('../views/Main/system/department/department.vue'),
//   },
// ]

// // 方式二 手动单独配置
// // 动态添加路由
// router.addRoute('main', localRouters[0])
// router.addRoute('main', localRouters[1])

// 路由守卫 ******
// to（跳转到那里）/form（从哪里来）
// 返回值 决定导航到哪里去
// 导航首次进入 / 也就是会跳转到main中，这里我们对main做一个守卫，当跳转到main的时候
router.beforeEach((to, form) => {
  let token = localCache.getCache('token')
  // if (to.path !== '/login' && !token) {
  if (to.path.startsWith('/main') && !token) {
    // 判断只有登陆成功后才可以跳转到main中
    console.log('---------beforeEach---------')
    return '/login'
  }

  if (to.path === '/main') {
    return firstMenu?.url
  }
})

export default router
